Conversation
admin_pages_dev: Added Admin Screens for ReadMe file
Reviewer's GuideThis PR integrates API-driven data fetching for admin provider and contact message lists via a new reusable Table component, updates related styles and layout for the admin interface sidebar and main content, and refreshes the README with new screen demos. File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
There was a problem hiding this comment.
Hey @Riyad-Murad - I've reviewed your changes and they look great!
Here's what I looked at during the review
- 🟡 General issues: 4 issues found
- 🟢 Security: all looks good
- 🟢 Testing: all looks good
- 🟢 Documentation: all looks good
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
| <tbody> | ||
| {data.map((item, idx) => ( | ||
| <tr key={idx}> | ||
| <td>{item.name}</td> |
There was a problem hiding this comment.
issue: Table component hardcodes data fields and doesn't align with provided headers
This will break if headers don’t match these hardcoded fields (e.g., missing message). Refactor Table to accept column accessors or render functions so each page can map its own data shape.
| {data.map((item, idx) => ( | ||
| <tr key={idx}> |
There was a problem hiding this comment.
suggestion (bug_risk): Avoid using array index as key in list rendering
Use a stable unique identifier (e.g., item.id or item.provider_id) instead of the array index to avoid rendering glitches when the list changes.
| {data.map((item, idx) => ( | |
| <tr key={idx}> | |
| {data.map(item => ( | |
| <tr key={item.id}> |
|
|
||
| export const fetchContactMessages = async () => { | ||
| try { | ||
| const response = await axiosInstance.get("admins/getAllContactMessages"); |
There was a problem hiding this comment.
nitpick (bug_risk): Inconsistent endpoint format between services
Use a consistent leading slash for your API paths to prevent URL resolution issues.
| <tbody> | ||
| {data.map((item, idx) => ( | ||
| <tr key={idx}> |
There was a problem hiding this comment.
suggestion: No empty state handling for tables with no data
Add a fallback row (e.g. 'No records found') when data is empty to prevent a blank table body and improve user feedback.
| <tbody> | |
| {data.map((item, idx) => ( | |
| <tr key={idx}> | |
| <tbody> | |
| {data.length === 0 ? ( | |
| <tr> | |
| <td colSpan={headers.length} style={{ textAlign: 'center' }}> | |
| No records found | |
| </td> | |
| </tr> | |
| ) : ( | |
| data.map((item, idx) => ( | |
| <tr key={idx}> |
Summary by Sourcery
Provide table-driven admin pages by integrating a new Table component and backend fetch services for providers and contact messages, update sidebar layout styling, and document the new admin screens in README.
New Features:
Enhancements:
Documentation: